<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>健康数据</title>
    <%- include('../header.ejs') -%>
        <link rel="stylesheet" href="../css/publis.css">
        <link rel="stylesheet" href="../css/fithess.css">
        <!-- <link rel="stylesheet" href="../css/layui.css"> -->
        <link rel="stylesheet" href="../layui/css/layui.css">
        <style>
            .home-bottom ul a:nth-child(2) li {
                color: red;
            }
            
            .tab {
                position: relative;
                width: 100%;
                /* height: 230px; */
                overflow: hidden;
                margin: 0 auto 20px auto;
                font-family: Arial;
                position: fixed;
                top: 0;
                left: 0;
                z-index: 999;
                background-color: aqua;
                height: 3rem;
                display: flex;
                align-items: center;
                justify-content: space-around;
            }
            
            .tab-nav {
                height: 30px;
                overflow: hidden;
                background: transparent;
                width: 100%;
                display: flex;
            }
            
            .tab-nav a {
                display: block;
                float: left;
                width: 100%;
                margin-right: 20px;
                height: 30px;
                line-height: 30px;
                text-align: center;
                text-decoration: none;
                color: #fff;
                font-size: 14px;
            }
            
            .tab-nav a.current {
                /* background: #80b600; */
                color: #fff;
                font-size: 18px;
                font-weight: 700;
                position: relative;
            }
            
            .tab-nav a.current::after {
                content: '';
                display: block;
                position: absolute;
                bottom: 0;
                left: 50%;
                width: 14px;
                height: 2px;
                margin-left: -7px;
                background-color: red;
            }
            
            .tab-con {
                position: relative;
                width: 100%;
                /* height: 200px; */
                overflow: hidden;
                background: transparent;
                /* margin-top: 3rem; */
            }
            
            .tab-con-item {
                /* display: none; */
                width: 100%;
                text-align: center;
                color: #fff;
                margin-bottom: 1rem;
                background-color: #fff;
                padding: 1rem;
                box-sizing: border-box;
            }
            
            .beijing {
                position: fixed;
                top: 0;
                left: 0;
                background-color: aqua;
                width: 100%;
                height: 15rem;
                border-radius: 0 0 50% 50%;
                z-index: -1;
            }
            
            table {
                width: 100%;
                margin-bottom: 5rem;
                background-color: transparent;
            }
            
            thead {
                width: 100%;
            }
            
            tbody {
                width: 100%;
                background-color: #fff;
            }
            
            thead tr {
                display: flex;
                /* height: 3rem; */
                padding: 0 0 1rem 0;
            }
            
            thead tr td {
                width: 100%;
                text-align: center;
                color: #6080AF;
            }
            
            tbody tr {
                display: flex;
                /* height: 3rem; */
                padding: 1rem 1rem 0 1rem;
            }
            
            tbody tr td {
                width: 100%;
                text-align: center;
                color: #AAAAAA;
                font-size: 14px;
            }
            
            table tbody:nth-last-child(1) tr {
                height: 1.5rem;
            }
            /* 日期样式 */
            
            .layui-laydate-range {
                width: 73% !important;
            }
            
            .layui-inline {
                z-index: 888;
                width: 100%;
                display: flex;
                margin: 0 auto;
                height: 40px;
                align-items: center;
                background-color: #6080AF;
                justify-content: center;
                /* margin-top: 30px; */
            }
            
            .layui-inline .layui-input {
                height: 30px;
            }
            
            .layui-left {
                width: 25%;
            }
            
            .layui-right {
                width: 25%;
            }
            
            .layui- {
                margin: 0 10px;
            }
            
            .box1 {
                margin-top: 3rem;
            }
            
            .layui-inline p {
                margin-right: 10px;
            }
            
            .layui-form-item {
                margin-bottom: 0;
                background-color: #6080AF;
            }
            
            .layui-form-item .layui-inline {
                display: flex;
                align-items: center;
                margin-bottom: 0;
            }
            
            .layui-inline .layui-inline {
                display: flex;
                align-items: center;
            }
            
            .layui-inline .layui-form-item .layui-inline .layui-form-label {
                overflow: visible;
            }
            
            .layui-inline .layui-form-item .layui-inline .layui-inline .layui-input-inline {
                margin: 0;
                left: 0;
                width: 100px !important;
            }
            
            .layui-inline .layui-form-item .layui-inline .layui-inline .layui-form-mid {
                margin: 0 10px;
            }
            
            .layui-input {
                height: 30px;
            }
            
            .layui-laydate-range {
                width: 97% !important;
            }
            
            .layui-laydate {
                display: flex !important;
                flex-wrap: wrap !important;
            }
            
            .layui-laydate-main {
                /* width: 272px; */
                width: 50% !important;
            }
            
            .layui-laydate-footer {
                width: 100% !important;
            }
            
            .layui-laydate-footer {
                padding: 0 !important;
            }
            
            .layui-laydate-header i.laydate-prev-y {
                left: 0px !important;
            }
            
            .layui-laydate-header i {
                top: 0px !important;
            }
            
            .layui-laydate-header i.laydate-prev-m {
                left: 20px !important;
            }
            
            .layui-laydate-header i.laydate-next-m {
                right: 20px !important;
            }
            
            .layui-laydate-header i.laydate-next-y {
                right: 0px !important;
            }
            
            .laydate-set-ym span {
                padding: 0 !important;
            }
            
            .layui-laydate-content {
                padding: 0 !important;
            }
            
            .layui-laydate-header {
                padding: 0 !important;
            }
            
            .layui-laydate-content table tr {
                width: 72% !important;
                height: 30px !important;
            }
            
            .layui-laydate-preview {
                margin-top: 10px !important;
            }
            /* 下拉框样式 */
            
            .select {
                /* display: flex;
                align-items: center;
                justify-content: flex-end; */
                text-align: right;
                margin-bottom: 1rem;
                background-color: #fff;
                padding: 10px;
                display: none;
            }
            
            .ecgDispaly {
                display: none;
            }
            
            .select button {
                margin: 5px 0 1rem;
            }
            
            .select select {
                width: 60px;
                /* 右边距，留给小三角，避免被文字压盖 */
                padding: 0 10px 0 10px;
                border: 1px solid #ddd;
                border-radius: 3px;
                font-size: 12px;
                line-height: 22px;
                /* 清除下拉菜单默认样式 */
                appearance: none;
                -moz-appearance: none;
                -webkit-appearance: none;
                /* 设置新的小三角背景 */
                /* background: url("../images/arrow_down.png") no-repeat 130px center; */
                background-size: 12px 6px;
            }
        </style>
</head>

<body>
    <div class="beijing">

    </div>
    <!-- <div class="tab" id="tab2">

        <div class="tab-nav j-tab-nav">

            <a href="#" id="fitness3" class="current">血压</a>

            <a href="#" id="bloodglucose1">血糖</a>

            <a href="#" id="oxygenlevel1">血氧</a>

            <a href="#" id="ecg1">心电</a>

            <a href="#" id="temperature1">体温</a>

        </div>
    </div> -->
    <div class="box1">
        <div class="layui-inline">
            <div class="layui-form-item">
                <div class="layui-inline">
                    <label class="layui-form-label">日期范围</label>
                    <div class="layui-inline" id="test-range">
                        <div class="layui-input-inline">
                            <input type="text" id="startDate" class="layui-input" placeholder="开始日期">
                        </div>
                        <div class="layui-form-mid">-</div>
                        <div class="layui-input-inline">
                            <input type="text" id="endDate" class="layui-input" placeholder="结束日期">
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>